var ComboBox = function(l,d,field){
	var comp = $('<div/>');
	var self = this;
	var dvCombo = null;
	var data = null; 
	var dvBtn = null;
	var inp = null;
	var lbl = null;
	var dvLbl = null;
	var popup = null;
	var f = field;
	
	this.hasField = true;
	var sValue = null;
	
	var create = function(){
		comp.hide();
		comp.addClass('combobox');
		dvCombo = $('<div/>');
		data = d;
		dvCombo.addClass('dv-combo');
		
		dvBtn = $('<div/>');
		dvBtn.addClass('dv-btn');
		inp = $('<input type="text"/>');
		inp.attr('readonly', true);
		lbl = $('<label/>');
	
		dvLbl = $('<div/>');
		dvLbl.append(lbl);
		comp.append(dvLbl);
		comp.append(dvCombo);
		popup = new ComboBoxPopup(self);
		popup.data(data);
		popup.hide();
	
		if( l ){
			lbl.text(l + ":");
		}
		self.width("200px");
		dvBtn.click(clickBtn);
		dvCombo.append(inp);
		dvCombo.append(dvBtn);
		comp.show();
	};
	
	this.width = function(w){
		inp.css("width",w);
		popup.setWidth(w);
	};
	
	this.height = function(h){
		inp.css("height",h);
	};
	
	this.getComp = function(){
		return comp;
	};
	
	this.bind = function(e){
		$(e).append(comp);
	};
	
	this.startValue = function(v){
		if( v != null ){
			sValue = v;
			this.value(v);			
		}else{
			return sValue;
		}
	};
	
	this.value=function(v){
		if( v != null){
			var item = popup.getItem(v);
			popup.selectItem(item);
		}else{
			if( popup.getItemSelected() ){
				return popup.getItemSelected().getValue();
			}
			return null;
		}
	};

	this.clear = function(){
		var item = popup.getItem(sValue);
		popup.selectItem(item);
	};
	
	this.label = function(v){
		if( v ){
			lbl.text(v + ":");
		}else{
			return lbl.text();
		}
	};
	
	this.getField = function(){
		return f;
	};
	
	this.setTextInput = function(t){
		inp.val(t);
	};
	
	var clickBtn = function(){
		popup.toggle();
	};

	var data = function(v){
		if( v ){
			popup.data(v);
		}else{
			return popup.data();
		}
	};
	
	create();
};

var ComboBoxPopup = function( o ){
	var dvPopup;
	var data;
	var itens = new Array();
	var self = this;
	var owner = o;
	var itemSelected;

	var create = function(){
		dvPopup = $("<div/>");
		owner.getComp().append(dvPopup);
		dvPopup.addClass("popup");
		dvPopup.mouseleave(function(){
			dvPopup.hide();
		});
	};

	this.toggle = function(){
		dvPopup.toggle();
	};

	this.hide = function(){
		dvPopup.hide();
	};
	
	this.data = function(d){
		if( d ){
			data = d;
			fillPopup();
		}else{
			return data;
		}
	};
	
	this.setWidth = function(w){
		dvPopup.css("width",w);
	};
	
	this.selectItem = function(i){
		itemSelected = i;
		if( i ){
			owner.setTextInput(i.getText());
		}else{
			owner.setTextInput(null);
		}
	};
	
	var fillPopup = function(){
		dvPopup.empty();
		itens = new Array();
		for( var i in data ){
			addItem(data[i].text,data[i].value);
		}
	};
	
	var addItem = function(t,v){
		var item = new ComboBoxItem(self,t,v);
		itens[itens.length] = item;
		dvPopup.append(item.getComp());
	};

	this.getItem = function(v){
		for( var i in itens ){
			if( itens[i].getValue() == v ){
				return itens[i]; 
			}
		}
		return null;
	};
	
	this.getItemSelected = function(){
		return itemSelected;
	};
	
	create();
};

var ComboBoxItem = function(o, t , v){
	var text = t;
	var value = v;
	var div;
	var owner = o;
	var self = this;
	
	var create = function(){
		div = $('<div/>');
		div.text(text);
		div.click(function(e){
			owner.selectItem(self);
			owner.toggle();
		});
	};
	
	this.getValue = function(){
		return value;
	};

	this.getText = function(){
		return text;
	};

	this.getComp = function(){
		return div;
	};

	create();
};
